<!--
 * Copyright © 2023
 * @Author: zhangxiang
 * @Date: 2023-02-14 09:55:42
 * @LastEditors: zhangxiang
 * @LastEditTime: 2023-02-14 14:05:36
 * @Description:
 *
-->

<template>
  <MyMain class="container">
    <el-tabs v-model="activeTab" class="tabs">
      <el-tab-pane label="接口" name="port">
        <!-- 接口 -->
        <DetailPort />
      </el-tab-pane>
    </el-tabs>
  </MyMain>
</template>

<script>
import MyMain from '@/components/Layout/MyMain.vue' // Main
import DetailPort from './components/DetailPort.vue' // 接口

export default {
  name: 'RouteMgmtDetail',
  components: { MyMain, DetailPort }, // 组件
  data() {
    return {
      activeTab: 'port' // 活动tab
    }
  },
  created() {},
  methods: {}
}
</script>

<style lang="less" scoped>
@import "@/assets/css/common.less";
.container {
  margin: 20px;
  width: auto;
  height: calc(100vh - 90px);
  padding: 10px 30px 20px;

  .tabs {
    /deep/ .el-tabs__header {
      margin-bottom: 20px;
    }
    /deep/ .el-tabs__item {
      height: 46px;
      line-height: 46px;
      font-weight: 500;
    }
  }
}
</style>
